import { MobilePageDesigner, Props } from 'components/mobilePageDesigner';
import { StationService as AdminStation } from 'admin/services/station';
import { StationService as UserStation } from 'user/services/stationService';
import React = require('react');
import { PageProps } from 'maishu-chitu-react';
import { PageSpiner, PageSpinerContext } from 'share/controls/page-spiner';

type LoadResult = ReturnType<ShoppingCartPage["loadData"]> extends Promise<infer T> ? T : unknown;
export default class ShoppingCartPage extends React.Component<PageProps> {
    adminStation: AdminStation;
    userStation: UserStation;

    constructor(props) {
        super(props)

        this.adminStation = this.props.createService(AdminStation);
        this.userStation = this.props.createService(UserStation);
    }

    async loadData() {
        let pageData: PageData = await this.userStation.pages.shoppingCart();
        return { pageData };
    }

    render() {
        return <PageSpiner load={() => this.loadData()}>
            <PageSpinerContext.Consumer>
                {args => {
                    let { pageData } = args.result as LoadResult;
                    let props: Props = {
                        pageData,
                        save: (pageData) => this.adminStation.savePageData(pageData),
                        showComponentToolbar: false,
                        showTemplateButton: false,
                        showSnapshootButton: false,
                        elementPage: this.props.source,
                    }
                    return <MobilePageDesigner {...props} />
                }}
            </PageSpinerContext.Consumer>
        </PageSpiner>
    }
}
